var maxFiat = 2;
var maxFerrari = 3;
var maxFord = 2;
var maxRenault = 1;
var maxPeugeot = 0;

function createGallery(id) {
	if (window.innerWidth > 800) {

		var marginTop = 20;
		var currentImage = document.getElementById(id);
		var src = currentImage.src;
		currentImage2 = new Image();
		currentImage2.onload = function() {

			var divTag = document.createElement("div");
			divTag.id = "gallery";
			divTag.setAttribute('style', 'opacity: 0');
			var inner = '<div id = "overlay"  ></div>	<div id = "imageContainer"  style=" width:'
					+ (currentImage2.width + 20)
					+ 'px; top: '
					+ (window.pageYOffset + marginTop)
					+ 'px;"> <img src="'
					+ src
					+ '" id = "autoGallery" alt="'
					+ currentImage.alt
					+ '" /> <div id = "galleryFooter"> <p id = "description" > '
					+ currentImage.alt
					+ '  </p>   <span id = "current"></span></div> <span id = "close">Chiudi X</span>    </div>	<div id = "prevNext" style=" height:'
					+ (currentImage2.height)
					+ 'px; width:'
					+ (currentImage2.width + 20)
					+ 'px; top: '
					+ (window.pageYOffset + marginTop)
					+ 'px;"> <span id ="next"   onclick="next()"><span>Next &nbsp</span></span> <span id ="prev"  onclick="prev()"><span>&nbsp Prev</span></span> </div>';
			divTag.innerHTML = inner;
			document.body.appendChild(divTag);
			document.getElementById("overlay").onclick = function() {
				deleteGallery();
			};
			document.getElementById("close").onclick = function() {
				deleteGallery();
			};

			var max = getMax();
			var len = src.length;
			var number = src.charAt(len - 6) + src.charAt(len - 5);
			if (number == 0)
				document.getElementById("prev").style.visibility = 'hidden';
			if (number == max)
				document.getElementById("next").style.visibility = 'hidden';

			document.getElementById("current").innerHTML = (parseInt(number) + 1)
					+ " di " + (max + 1);
			setTimeout('document.getElementById("gallery").style.opacity="1";',
					20);
		}
		currentImage2.src = src;
	}

}

function deleteGallery() {
	document.getElementById("gallery").style.opacity = "0";
	setTimeout(
			'd = parent.document.body; gallery = parent.document.getElementById("gallery"); d.removeChild(gallery); ',
			500);
}

function getMax() {
	var image = document.getElementById('autoGallery');
	var src = image.src;
	var len = src.length;
	var i = 0;
	while (src.charAt(len - 8 - i) != "/") {
		i = i + 1;
	}
	var type = src.substr(len - 8 - i + 1, i);
	var max = -1;

	switch (type) {
	case "fiat":
		max = maxFiat;
		break;
	case "ferrari":
		max = maxFerrari;
		break;
	case "ford":
		max = maxFord;
		break;
	case "renault":
		max = maxRenault;
		break;
	case "peugeot":
		max = maxPeugeot;
		break;

	}
	return max;
}

function next() {

	var image = document.getElementById('autoGallery');
	var src = image.src;
	var len = src.length;
	var number = src.charAt(len - 6) + src.charAt(len - 5);
	var max = getMax();

	if (max != -1 && number != max) {
		var next = parseInt(number) + 1;
		document.getElementById("current").innerHTML = (next + 1) + " di "
				+ (max + 1);
		if (next < 10) {
			next = "0" + next;
		}
		var newSrc = src.substr(0, len - 6) + next + src.substr(len - 4);
		image.src = newSrc;
		var currentImage = new Image();
		currentImage.onload = function() {
			var height = currentImage.height;
			var width = currentImage.width + 20;
			document.getElementById("prevNext").style.height = height + "px";
			document.getElementById("prevNext").style.width = width + "px";
			document.getElementById("imageContainer").style.width = width
					+ "px";
			if (next == max) {
				document.getElementById("next").style.visibility = 'hidden';
			}
			document.getElementById("prev").style.visibility = 'visible';
		}
		currentImage.src = newSrc;
		fixAlt(newSrc);
	}

}

function prev() {
	var image = document.getElementById('autoGallery');
	var src = image.src;
	var len = src.length;
	var number = src.charAt(len - 6) + src.charAt(len - 5);
	if (number > 0) {
		var next = parseInt(number) - 1;
		document.getElementById("current").innerHTML = (1 + next) + " di "
				+ (1 + getMax());
		if (next < 10) {
			next = "0" + next;
		}
		var newSrc = src.substr(0, len - 6) + next + src.substr(len - 4);
		image.src = newSrc;
		var currentImage = new Image();
		currentImage.onload = function() {
			var height = currentImage.height;
			var width = currentImage.width + 20;
			document.getElementById("prevNext").style.height = height + "px";
			document.getElementById("prevNext").style.width = width + "px";
			document.getElementById("imageContainer").style.width = width
					+ "px";
			if (next == 0) {
				document.getElementById("prev").style.visibility = 'hidden';
			}
			document.getElementById("next").style.visibility = 'visible';

		}
		currentImage.src = newSrc;
		fixAlt(newSrc);
	}
}

function fixAlt(newSrc) {
	var id = newSrc;
	var n = Math.max(id.lastIndexOf("/"), id.lastIndexOf("\\"));
	id = id.substr(n + 1, id.length);

	document.getElementById("description").innerHTML = document
			.getElementById(id).alt;
	document.getElementById("autoGallery").alt = document.getElementById(id).alt;
}